$(function(e){
    $('.generic-container .content form input:submit').addClass('submit-button');
    function getMessage(mess){
        var message = '';
        switch(mess){
            case 'acceptFileTypes':
               message = 'please choose pictures only'; 
            break;
            
            case 'maxFileSize':
                message = 'please resize your picture'; 
            break;
            
            case 'minFileSize':
                message = 'this is not a picture'; 
            break;
            
            case 'maxNumberOfFiles':
                message = 'only two pictures allowed'; 
            break;
            
            case 'success':
                message = 'upload successful'; 
            break;
            
            default: 
                message = 'something went wrong';
            break;
        }
        return message;
    }
    //$('').html($('<ul></ul>'));
    function getPics(){
        $.ajax({
            type:"GET",
            url: ajaxUrl + '/myPics',
            success:function(data, res){
                $('.be-discovered-form-pics-cont ul').html('');
                $.each(data, function(i, val){
                    var thumb = $('<img></img>')
                               .attr('src', val.url)
                               .attr('height', '100');
                    var closeButton = $('<span></span>')
                                      .addClass('ui-icon ui-icon-close iconclose');
                    var thumbCont = $('<div></div>')
                                    .append(thumb)
                                    .append(closeButton);
                     $('.be-discovered-form-pics-cont ul').append($('<li></li>').append(thumbCont));
                     
                     closeButton.bind('click' , {par:thumbCont ,del:val.name}, function(ev){
                          $(ev.data.par).remove();
                          $.ajax({
                            type:"POST",
                            url: ajaxUrl + '/myPics',
                            data: {
                                file: ev.data.del,
                                _method: 'DELETE'
                            },
                            success: function(data, res){
                                $('.be-discovered-form-pics-cont .progress').html('');
                            }
                         });
                         
                     });
                });
            },
            dataType:"json",
            cache:false
         });
    }
    
    getPics();
    $('#be-discovered-form-pictures').before($('<button></button>').addClass('wowbutton').append('choose pictures'));
    $('button.wowbutton').button();
    $('button.wowbutton').click(function(event){
        event.preventDefault();
        $('#be-discovered-form-pictures').click();
    });
    $('#be-discovered-form-pictures').hide();
    $('#be-discovered-form-pictures').before($('<div></div>').addClass('be-discovered-form-pics-cont'));    
    $('.be-discovered-form-pics-cont').append($('<div></div>').addClass('progress').css('width', '260px'));
    $('.be-discovered-form-pics-cont').append($('<ul></ul>'));
    $('#be-discovered-form-pictures').fileupload({
        dataType: 'json',
        url: ajaxUrl + '/myPics',
        formData: function(context){
           return  $(context).add('#be-discovered-form-pictures').val();
        },
        start: function(e, data){
            $('.be-discovered-form-pics-cont .progress').html('');
            $('button.wowbutton').button( "option", "disabled", true );
            //$('#test-progress').append('<p>'+0+'</p>');
        },
        done: function (e, data) {
            $('.be-discovered-form-pics-cont .progress').progressbar( "destroy" );
            $('button.wowbutton').button( "option", "disabled", false );
            if($.isArray(data.result)){
                $.each(data.result, function (index, res) {
                    if(typeof res.error != 'undefined'){
                        //$('.be-discovered-form-pics-cont .progress').addClass('form-line-error').html(getMessage(res.error));
                        $('.be-discovered-form-pics-cont .progress')
                        .html($('<label></label>')
                                //.attr('for', 'be-discovered-form-pictures')
                                .addClass('form-line-error')
                                .append(getMessage(res.error))
                                .css('font-size','11px'));
                    }else{
                        $('.be-discovered-form-pics-cont .progress')
                        .html(getMessage('success'));
                    }
                });
            }
            
            /*
            $.each(data.result, function (index, file) {
                $('<p/>').text(file.name).appendTo(document.body);
            });
            */
            //$('#test-progress').append('<p>'+100+'</p>');
            getPics();
        },
        progress: function (e, data) {
            var progress = parseInt(data.loaded / data.total * 100, 10);
            $('.be-discovered-form-pics-cont .progress').progressbar({
                value: progress,
                complete: function(event, ui){
                    $(this).progressbar( "destroy" );
                }
            });
            //$('#test-progress').append('<p>'+progress+'</p>');
        },
        maxNumberOfFiles: 2
    });
    
});



